<?php
//本页是重设密码页
header('content-type:text/html;charset=utf-8');
include 'include/init.php';

session_start();

if(!isset($_SESSION['findpwdcode'])||!isset($_GET['code']))
{
	die('<h2>本页面禁止非法访问，如果你是正常操作，请联系管理员。</h2>This page is not allow to view!');
}
if(!$_SESSION['findpwdcode']==$_GET['code'])
{
	die('<h2>参数错误，如果你是正常操作，请联系管理员。</h2>Parameter error!');
}

$ex=explode(',',$_SESSION['findpwdcode']);
$time=$ex[0];

$timeout=time()-$time;
if($timeout>=1800)
{
	session_unset();
	session_destroy();
	die('<h2>超时操作，请重新获取。</h2>Timeout over，please reset！');
}

//销毁session以防止多次提交
unset($_SESSION['findpwdcode']);

?>
<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>重置密码</title>
  <style type="text/css">
	body
	{
		font-family:'微软雅黑';
		font-size:12px;
		font-weight:lighter;
	}
	.box
	{
		width:780px;
		height:350px;
		background:white;
		border:2px solid #0099FF;
		border-top:6px solid #0099FF;

		-moz-box-shadow: 0px 0px 15px #666;  
		-webkit-box-shadow: 0px 0px 15px #666;   
		box-shadow: 0px 0px 15px #666;
		margin:40px auto;
	}
	.resetfm
	{
		width:100%;
		height:100%;
	}
	.title
	{	
		margin:0;
		margin-top:20px;
		height:24px;
		line-height:24px;
		margin-left:20px;
		font-size:20px;
		text-indent:4px;
		border-left:5px solid#0099FF; 
	}
	.inputbox
	{
		margin:10px auto;
		border-top:1px solid #CCC;
		width:740px;
		height:280px;
	}


	.inputbox table
	{
		width:100%;
		height:100%;
		margin:0;
		padding:0;
		text-align:center;
		table-layout:fixed ; 
		position:relative;
		border-collapse: collapse;
	}
	.inputbox table tr
	{
		height:30px;
	}
	.inputbox table tr td:first-child
	{
		width:25%;
		text-align:right;
		font-size:14px;
		margin-right:10px;
	}
	.inputbox table tr td:last-child
	{
		width:32%;
		text-align:left;
	}

	/*输入框样式*/
	.inputbox table input
	{
		width:300px;
		height:33px;
		border-radius:3px;
		font-size:14px;
		border:none;
		outline:none;
		text-indent:10px;
		background: url(img/regin/ipt.png?v=10076) no-repeat;
	}
	.inputbox table input.input_err
	{
		background: url(img/regin/input_error.png?v=10077) no-repeat;
	}
	.inputbox table input:focus
	{
		box-shadow:0px 0px 3px #0099FF;
		-moz-box-shadow:0px 0px 3px #0099FF;
		-webkit-box-shadow:0px 0px 3px #0099FF;
		background: url(img/regin/ipt.png?v=10076) 0 -35px no-repeat;
	}

	/*注册信息提示标签*/
	.inputbox table .tips .pwd_tips
	{
		font-family:'宋体';
		width: 158px;
		height: 71px;
		padding-top: 6px;
		position: absolute;
		top: 42px;
		background: url(img/regin/pwd_sprite.png?v=10076) no-repeat;
		
	}
	.inputbox table .tips .pwd_tips div
	{
		height: 22px;
		line-height: 22px;
		margin-left: 15px;
		padding-left: 18px;
	}
	.inputbox table .tips .pwd_tips .default 
	{
		background: url(img/regin/pwd_sprite.png?v=10076) 0 -215px no-repeat;
	}
	.inputbox table .tips .pwd_tips .no 
	{
		background: url(img/regin/pwd_sprite.png?v=10076) 0 -281px no-repeat;
	}
	.inputbox table .tips .pwd_tips .yes 
	{
		background: url(img/regin/pwd_sprite.png?v=10076) 0 -247px no-repeat;
	}
	.inputbox table .red
	{
		color:#f66;
	}

	.inputbox table .tips .ok
	{
		color:#999;
		height: 22px;
		line-height: 22px;
		margin-left: 12px;
		padding-left: 18px;
		background: url(img/regin/pwd_sprite.png?v=10076) 0 -247px no-repeat;
	}

	.inputbox table .tips .warn
	{
		color:#FF0033;
		height: 22px;
		line-height: 22px;
		margin-left: 12px;
		padding-left: 18px;
		background: url(img/regin/pwd_sprite.png?v=10076) 0 -281px no-repeat;
	}
	.inputbox table .tips .default
	{
		height: 22px;
		line-height: 22px;
		margin-left: 12px;
		padding-left: 18px;
		background: url(img/regin/pwd_sprite.png?v=10076) 0 -215px no-repeat;
	}

	.inputbox table .tips .notice
	{
		color:#999;
		margin-left:12px;
	}

	/*密码安全等级*/
	.inputbox table .tips .ranktips
	{
		display:none;
	}
	.inputbox table .tips .ranktips .password_info
	{
		color:grey;
	}
	.inputbox table .tips .ranktips .rankMiddle
	{
		float: left;
		width:130px;
		height: 15px;
		padding-left: 70px;
		color: #61d01c;
		background: url(img/regin/pwd_sprite.png?v=10076)0 -142px no-repeat;
	}
	.inputbox table .tips .ranktips .rankHigh
	{
		float: left;
		width:130px;
		height: 15px;
		padding-left: 70px;
		color: #61d01c;
		background: url(img/regin/pwd_sprite.png?v=10076)0 -190px no-repeat;
	}
	.inputbox table .tips .ranktips .rankLow
	{
		float: left;
		width:130px;
		height: 15px;
		padding-left: 70px;
		color: #ff9c3a;
		background: url(img/regin/pwd_sprite.png?v=10076)0 -100px no-repeat;
	}

	.submitbtn
	{
		width:200px;
		height:40px;
		line-height:40px;
		margin:10px auto;
		cursor:default;
		border-radius:6px;
		font-size:16px;
		text-align:center;
		border:1px solid #CCC;
		color:white;
		-moz-box-shadow: 0px 0px 10px #999;  
		-webkit-box-shadow: 0px 0px 10px #999;   
		box-shadow: 0px 0px 10px #999;
	}
	.submitbtn
	{
		background:#66CCFF;
	}
	.submitbtn:hover
	{
		
		background:#0099CC;
	}

	.account
	{
		font-size:20px;
	}

  </style>
	<script type="text/javascript" src="js/jquery.js"></script>

 </head>
 <body>
	<div class="box">
		<form action="action/resetpwdok.php" method="post" class="resetfm" id="resetfm">
			<p class="title">重置密码</p>
			<div class="inputbox">
				<input type="hidden" name="id" value="<?php echo $_SESSION['usr']; ?>"/>
				<input type="hidden" name="email" value="<?php echo $_SESSION['email']; ?>"/>
				<table>
				<tr>
					<td>邮箱账号：</td>
					<td class="account"><?php echo $_SESSION['email']; ?></td>
					<td></td>
				</tr>
				<tr>
					<td>密码：</td>
					<td><input name="pwd" type="password"/></td>
					<td class="pwd_tips tips">
						<div class="pwd_tips" id="pwd_tips">
							<div class="default" id="pwd_tip1">长度为6-16个字符</div>
							<div class="default" id="pwd_tip3">不能包含空格</div>
							<div class="default" id="pwd_tip2">不能是9位以下纯数字</div>
						</div>
						<div class="ranktips">
							<div id="password_pic" class="rankLow">中等</div>
							<div id="password_info" class="password_info">复杂度还行，再加强一下等级？</div>
						</div>
					</td>
				</tr>
				<tr>
					<td>确认密码：</td>
					<td><input name="repwd" type="password"/></td>
					<td class="repwd_tips tips"></td>
				</tr>
				<tr>
					<td></td>
					<td><div class="submitbtn">确认修改</div></td>
					<td></td>
				</tr>
				</table>
			</div>
		</form>

	</div>
  
 </body>
 <script type="text/javascript">
		function settips(pl,ty,str)
		{
			$('.'+pl+'_tips').html('<div class="'+ty+'">'+str+'</div>');
		}

		/*密码*/
		$(".resetfm input[name='pwd']").focus(function()
		{
			$(this).removeClass('input_err');

			$('.ranktips').css('display','none');
			$('.pwd_tips').css('display','block');

		}).focusout(function(e)
		{
			var val=$.trim($(this).val());
			if(val.length<=0)
			{
				$(this).addClass('input_err');
				//$('.pwd_tips').css('display','block');
			}
			checkpwd(e);
		}).keyup(checkpwd);

		function checkpwd(e)
		{
			var ts=$(e.target);
			var val=$.trim(ts.val());
			
			if(val.length>16)
			{
				val=val.substring(0,16);
				$(e.target).val(val);
			}

			$('.ranktips').css('display','none');
			$('.pwd_tips').css('display','block');

			var flag=true;
			ts.removeClass('input_err');
			
			//用正则检查密码，根据情况提示
			//检查长度
			if(val.length<6||val.length>16)
			{
				$("#pwd_tip1").attr('class','no red');
				flag=false;
			}
			else
			{
				$("#pwd_tip1").attr('class','yes');
			}
			//检查是否有空格
			if(/\s/.test(val))
			{
				$("#pwd_tip3").attr('class','no red');
				flag=false;
			}
			else
			{
				$("#pwd_tip3").attr('class','yes');
			}
			//检查是否是9位以下纯数字
			if(val.match(/^\d{0,9}$/))
			{
				$("#pwd_tip2").attr('class','no red');
				flag=false;
			}
			else
			{
				$("#pwd_tip2").attr('class','yes');
			}
			
			//如果都通过，则判断密码强度，并隐藏提示盒，显示强度提示
			if(flag)
			{
				$('.pwd_tips').css('display','none');

				var tempstr=val;
				//长度小于10个
				if(val.length<10)
				{
					$('#password_pic').attr('class','rankLow').html('低');
					$('#password_info').html('试试字母，数字，标点的组合吧');
				}
				//非数字非不可见字符长度5个或以上
				else if(tempstr.replace(/\d/g,'').length>4)
				{
					$('#password_pic').attr('class','rankMiddle').html('中等');
					$('#password_info').html('复杂度还行，再加强一下等级？');
				}
				//长度16且首个必须为字母且非数字非不可见字符长度8个或以上
				if(val.length==16&&val.match(/^[A-Za-z]{1}[^\s]{15}$/)&&tempstr.replace(/\d/g,'').length>7)
				{
					$('#password_pic').attr('class','rankHigh').html('高');
					$('#password_info').html('密码强度好，请记牢');
				}
				
				$('.ranktips').css('display','block');
			}
			else
			{
				ts.addClass('input_err');
			}
			
		}
		
		/*再次输入密码*/
		$(".resetfm input[name='repwd']").focus(function()
		{
			$(this).removeClass('input_err');
			var val=$.trim($(this).val());
			if(val==$(".resetfm input[name='pwd']").val()&&val.length>=6)
			{
				settips('repwd','ok','');
			}
			else
			{
				settips('repwd','notice','请再次输入密码');
			}
				
		}).keyup(function()
		{
			var val=$.trim($(this).val());
			if(val.length>16)
			{
				val=val.substring(0,16);
				$(this).val(val);
			}
			if(val==$(".resetfm input[name='pwd']").val()&&val.length>=6)
			{
				settips('repwd','ok','');
			}
			else
			{
				settips('repwd','warn','密码不一致');
			}
		}).focusout(function()
		{
			var val=$.trim($(this).val());
			if(val.length<=0)
			{
				settips('repwd','warn','请再次输入密码');
				$(this).addClass('input_err');
			}
			if(val.length>16)
			{
				val=val.substring(0,16);
				$(this).val(val);
			}
			if(val==$(".resetfm input[name='pwd']").val()&&val.length>=6)
			{
				settips('repwd','ok','');
			}
			else
			{
				settips('repwd','warn','密码不一致');
				$(this).addClass('input_err');
			}
		});



		$('.submitbtn').click(function()
		{
			var flag=true;
			var pwd=$.trim($(".resetfm input[name='pwd']").val());
			if(pwd.length<=0)
			{
				$(".resetfm input[name='pwd']").trigger("focusout");
				flag=false;
			}

			var repwd=$.trim($(".resetfm input[name='repwd']").val());
			if(repwd.length<=0)
			{
				$(".resetfm input[name='repwd']").trigger("focusout");
				flag=false;
			}

			if(repwd!=pwd)
			{
				flag=false;
			}

			if(flag)
			{
				$(this).html("提交中...");
				$("#resetfm").submit();
			}


		});

	</script>
</html>